<pre>更多地图API请访问:  <a target="_blank" href="https://xieziyu.github.io/ngx-amap/">https://xieziyu.github.io/ngx-amap/</a></pre>
<ngx-amap #map class="demo-map" [resizeEnable]="true" [zoom]="zoom" [zooms]="[4,24]"
          (ready)="mapReady($event)">
    <amap-text *ngIf="!amapTextHidden" [position]="amapTextPosition" [draggable]="true" [text]="amapTextContent"
               textAlign="center" verticalAlign="middle"
               cursor="pointer" [offset]="{x: 7, y: -35}"></amap-text>
    <amap-tool-bar></amap-tool-bar>
    <amap-marker-clusterer [minClusterSize]="2" [zoomOnClick]="true" [maxZoom]="10" [averageCenter]="true"
                           [gridSize]="80">

        <amap-marker *ngFor="let marker of markers"
                     [position]="[marker.longitude,marker.latitude]"
                     [content]="setMarkerColor(marker.color)"
                     [offset]="{x:-15, y:-15}" (markerClick)="markerClick()"
                     (mouseOver)="markerMouseOver([marker.longitude,marker.latitude])"
                     (mouseOut)="markerMouseOut()">
            <amap-info-window [position]="marker.position">
                <ul class="description">
                    <li>全国统一编号：{{marker.unifyCode}}</li>
                    <li>种质形态：{{marker.germplasmShape}}</li>
                    <li>种质类型：{{marker.germplasmType}}</li>
                    <li>科中文名：{{marker.familyName}}</li>
                    <li>科拉丁名：{{marker.familyLatinName}}</li>
                    <li>属中文名：{{marker.genusName}}</li>
                    <li>属拉丁名：{{marker.genusLatinName}}</li>
                    <li>种名：{{marker.speciesName}}</li>
                    <li>学名：{{marker.academicName}}</li>
                    <li>全珠图像：
                        <kylin-images [eleId]="'wholeImg'"
                                      [images]="marker.wholeImg"></kylin-images>
                    </li>
                    <li>花果图像：
                        <kylin-images [eleId]="'flowersFruitsImg'"
                                      [images]="marker.flowersFruitsImg"></kylin-images>
                    </li>
                    <li>种子图像：
                        <kylin-images [eleId]="'seedImg'"
                                      [images]="marker.seedImg"></kylin-images>
                    </li>
                </ul>
            </amap-info-window>
        </amap-marker>
    </amap-marker-clusterer>
</ngx-amap>
